/*
 * @Title: 设置密码
 * @Created by: gsjPC 
 */
<template>
	<view>
		<comHeader :config="navConfig"/>
		<view class="dlWrap">
			<view class="dlInput_psd">
				<view class="dlInput_numb">
				<text>设置密码</text>
				<input 
				:type="isVisiblePsd0" 
				placeholder="填写密码" 
				placeholder-style="color:#CCCCCC"
				placeholder-class="placecLass"
				@input="focusClass1"
				:class="[isActive1 ? 'blueBorder' : '']"/>
				</view>
				<view @tap="eyeBtn0"><image :src="isVisiblePsd0 == 'password' ? '/static/psdeye1.png' : '/static/psdeye0.png'"></image></view>
				<!-- <view><uni-icon type="arrowdown" size="20" color="#A7A7A7"></uni-icon></view> -->
			</view>
			<!-- 密码登录 -->
			<view class="dlInput_psd">
				<view class="dlInput_numb">
				<text>确认密码</text>
				<input 
				:type="isVisiblePsd1"
				placeholder="再次确认密码" 
				placeholder-style="color:#CCCCCC"
				placeholder-class="placecLass"
				@input="focusClass2"
				:class="[isActive2 ? 'blueBorder' : '']"/>
				</view>
				<view @tap="eyeBtn1"><image :src="isVisiblePsd1 == 'password' ? '/static/psdeye1.png' : '/static/psdeye0.png'"></image></view>
			</view>
			<view class="goIndex" @tap="goLog">确认</view>
		</view>
	</view>
</template>

<script>
	export default{
		data(){
			return{
				navConfig:{
					isFixed:false,
					left:{
						text:'',  
						isShowLeft:true,
						leftGobackColor:'black',
						leftTextColor:'black',
					},
					mid:{
						isShowMid:true,
						text:'设置密码'
					},
					right:{
						text:'',
						isShowRight:false,
					}
				},
				isVisiblePsd0:'password',//密码登录是否可见
				isVisiblePsd1:'password',//再次确认密码登录是否可见
			}
		},
		methods:{
			// 确认设置密码后跳到账号登陆
			goLog(){
				uni.navigateTo({
					url:'/pages/login/loginCon'
				})
			},
			eyeBtn0(){
				if(this.isVisiblePsd0 == 'password'){
					this.isVisiblePsd0 = 'text'
					}else{
					this.isVisiblePsd0 = 'password'
					}
			},
			eyeBtn1(){
				if(this.isVisiblePsd1 == 'password'){
					this.isVisiblePsd1 = 'text'
					}else{
					this.isVisiblePsd1 = 'password'
					}
			}
		}
	}
</script>

<style>
	.rootLog{
		padding-top:60upx;
	}
	.dlBoxIco{
		width:120upx;
		height:120upx;
		border-radius: 20upx;
		margin:0 auto;
		/* background:linear-gradient(top,#5691FF,#54A6FF) ; */
	}
	.dlBoxIco image{
		width:120upx;
		height:120upx;
	}
	.dlWrap{
		margin:0upx 44upx 0 44upx;
		padding-top: 128upx;
	}
	.logTypeBotm{
		width: 100%;
		position: absolute;
		bottom:42upx;
		left:-50%;
		margin-left: 50%;
		display: flex;
		justify-content: center;
	}
	.logTypeBotm image{
		width:58upx;
		height: 58upx;
		margin-left:72upx;
	}
	.logTypeBotm image:first-child{
		margin-left: 0;
	}
	
	.changeLoginType{
		color: #549BFF;
		font-size:24upx;
		margin-top:66upx;
		display: flex;
		flex-direction: row;
		justify-content: flex-end;
		padding: 10upx;
		padding-right: 0;
	}
	.loginMethod{
		margin-top: 28upx;
		color: #999;
		font-size: 24upx;
		text-align: center;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
	}
	.loginMethod .line{
		font-weight: 500;
		margin:0 10upx;
	}
	.loginMethod text{
		padding:10upx;
	}
	.dlInput_numb{
		display: flex;
		flex-direction: row;
		align-items: center;
	}
	
	.dlInput_psd{
		margin-top: 76upx;
		padding-bottom:20upx;
		height:46upx;
		display: flex;
		flex-direction: row;
		align-items: center;
		border-bottom: 1upx solid #DCDCDC;
		justify-content: space-between;
	}
	.dlInput_psd text{
		color: #333333;
		font-size: 28upx;
	}
	.dlInput_psd input{
		margin-left:70upx;
		height:46upx;
		line-height:46upx;
		color: #333;
		font-size: 28upx;
	}
	.dlInput_psd view image{
		padding:0 12upx;
		max-width:37upx;
		max-height:30upx;
	}
	/* .blueBorder{
		border-bottom: 1upx solid #55A0FF!important;
	} */
	.goIndex{
		height: 88upx;
		line-height: 88upx;
		border-radius:88upx;
		font-size: 28upx;
		background: linear-gradient(left,#54AAFF,#568FFF);
		text-align: center;
		color: #ffffff;
		margin-top:110upx;
	}
	.smallBtn{
		color: #559EFF;
		font-size: 24upx;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		margin-top: 66upx;
	}
	.forPsd{
		padding:10upx;
		padding-left:0;
	}
	.goReg{
		color: #999999;
		}
	.goReg text{
		color: #559EFF;
		padding:10upx;
	}
	.goReg text:last-child{
		padding-right:0;
	}
	.getYzm{
		width:190upx;
		height: 63upx;
		line-height: 63upx;
		background: #559DFF;
		border-radius: 10upx;
		text-align: center;
		color: #FFFFFF;
		font-size: 24upx;
	}
</style>
